<template>
   <div class="app-container">
       <div class="item hauto ld">
            <fieldset>
            <legend>销售单信息</legend>
            <div class="fd-content">
                <div class="fd-item">
                    <span class="name">客户姓名：</span><span class="value">{{customername}}</span>
                    <span class="name">联系电话：</span><span class="value">{{customerphone}}</span>
                </div>
                <div class="fd-item">
                    <span class="name">订单合同号：</span><span class="value">{{contractnumber}}</span>
                    <span class="name">销售单号：</span><span class="value">{{salesnumber}}</span>
                </div>
                <div class="fd-item">
                    <span class="name">日期:</span><span class="value">{{salesdate}}</span>
                </div>
                <div class="fd-item">
                    <span class="name">具体车型：</span><span class="value">{{salescar}}</span>
                    <span class="name">VIN码：</span><span class="value">{{vincode}}</span>
                </div>
                <div class="fd-item">
                    <span class="name">合同金额：</span><span class="value">{{salesprice}}</span>
                    <span class="name">付款类型：</span><span class="value">{{paytype | parsePayType}}</span>
                </div>
                <div class="fd-item">
                    <span class="name">已收全款：</span><span class="value">{{fullpaystate ? '是':'否'}}</span>
                    <span class="name"></span><span></span>
                </div>
                <div class="fd-item">
                    <span class="name">加装办理：</span><span class="value">{{extraaddstate | parseHandingType}}</span>
                    <span class="name">保险办理：</span><span class="value">{{insurancestate | parseHandingType}}</span>
                </div>
                <div class="fd-item">
                    <span class="name">代办办理：</span><span class="value">{{agencystate | parseHandingType}}</span>
                    <span class="name">赎证：</span><span class="value">{{redemptioncert ? '是':'否'}}</span>
                </div>
                <div class="fd-item">
                    <span class="name">状态：</span><span class="value">{{salestate}}</span>
                    <span class="name"></span><span class="value"></span>
                </div>
                <div class="fd-item">
                    <span class="name">备注</span><span class="value">{{remark}}</span>
                </div>
            </div>
            </fieldset>
        </div>
        
        
   </div>
</template>

<script>

import * as salesApi from '@/api/presale/sales'
import * as enumHelper from '@/utils/enum'

export default {
    data(){
        return {
            id:'',
            customerphone:'',
            customername:'',
            salesnumber:'',
            contractnumber:'',
            salesdate:'',
            salescar:'',
            vincode:'',
            salesprice:0,
            paytype:'',
            fullpaystate:0,
            extraaddstate:0,
            insurancestate:0,
            agencystate:'',
            redemptioncert:'',
            salestate:0,
            createtime:'',
            remark:'',
        }
    },
    created(){
        this.id=this.$route.params.id || '';
        this.fetchData();
    },
    filters:{
      parseHandingType(val){
        return ['无','已办理','未办理'][val];
      },
      parsePayType(val){
        return enumHelper.presale.payType.getName(val);
      },
      parseSalesState(val){
        return enumHelper.presale.salesState.getName(val);
      }

    },
    methods:{
        fetchData(){
            var that=this;
            salesApi.getSalesDetails({id:that.id}).then(res=>{
                if(res.data){
                    for(var key in that){
                        if(res.data[key.toLowerCase()]!==undefined){
                            that[key]=res.data[key.toLowerCase()];
                        }
                    }
                }
            })
        }
    }
}
</script>

<style scoped>
  .item.ld{
        padding:5px 10px;margin-bottom:20px;
    }
   .item.ld>fieldset{
        width:100%;
    }
    .fd-content>.fd-item{
        padding:5px 10px; display: flex; 
    }
    .fd-content>.fd-item>span.name{
        width:100px; display: flex; align-items: center;
        color:#999;
    }
    .fd-content>.fd-item>span.value{
        width:300px; display: flex; align-items: center;
    }
</style>